<!-- this.$emit用于子组件向父组件传递自定义事件 -->
<template>
  <div class="father">
    <!-- 使用v-model指令 -->
    <input type="text" v-model="userName" />

    <!-- v-model的本质是下面这行代码 -->
    <input
      type="text"
      :value="userName"
      @input="userName = (<HTMLInputElement>$event.target).value"
    />
    <h1>---------------------</h1>
    <h3>父组件，</h3>
    <h4>我的车：{{ car }}</h4>
    <Child v-model="car"></Child>
    <h1>-----------等同于----------</h1>
     <Child :modelValue="car" @update:model-value="car= $event"></Child>
     <h1>------------也可以更换成value-在parent2和child2中演示----------------</h1>
  </div>
</template>

<script setup lang="ts" name="Father">
import Child from './Child.vue'
import { ref } from 'vue'
// 数据
const car = ref('奔驰')
const userName = ref()
</script>
